<!DOCTYPE html>
<html>
<head lang="zh">
    <meta charset="UTF-8">
    <title>Carousel Template</title>
    <meta content="学习案列" name="Description">
    <meta content="bootstrap 前端学习 css" name="Keywords">
    <!--360浏览器默认为极速模式打开-->
    <meta name="renderer" content="webkit">
    <!--坑爹的IE兼容-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!-- Bootstrap -->
    <link rel="stylesheet" href="./css/bootstrap.min.css"/>
    <link rel="stylesheet" href="./css/style.css"/>
</head>


<body>
<div class="container to-top">
    <nav class="navbar navbar-inverse ">
        <div class="navbar-inner">
            <div>
                <ul class="nav">
                    <li>
                        <a href="#">Project name</a>
                    </li>
                    <li  class="active">
                        <a href="#">Home</a>
                    </li>
                    <li>
                        <a href="#">About</a>
                    </li>
                    <li>
                        <a href="#">Contact</a>
                    </li>
                    <li>
                        <a href="#">Dropdown</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
</div>


<div id="sd">
    <div id="myCarousel" class="carousel slide">
        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
        </ol>

        <!-- Carousel items -->
        <div class="carousel-inner">
            <div class="active item">
                <img class="car-img" src="http://v2.bootcss.com/assets/img/examples/slide-01.jpg" alt=""/>
                <div class="container car-cont">
                    <h1>Another example headline.</h1>
                    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                    <button class="btn btn-primary btn-large">Browse gallery</button>
                </div>
            </div>
            <div class="item">
                <img class="car-img" src="http://v2.bootcss.com/assets/img/examples/slide-02.jpg"alt=""/>
                <div class="container car-cont">
                    <h1>Another example headline.</h1>
                    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                    <button class="btn btn-primary btn-large">Sign up today</button>
                </div>

            </div>
            <div class="item">
                <img class="car-img" src="http://v2.bootcss.com/assets/img/examples/slide-03.jpg" alt=""/>
                <div class="container car-cont">
                    <h1">Another example headline.</h1>
                    <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                    <button class="btn btn-primary btn-large">Learn more</button>
                </div>
            </div>
        </div>
        <!-- Carousel nav -->
        <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
        <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
    </div>
</div>
<article>


</article>

<script src="http://code.jquery.com/jquery.js"></script>
<script src="./js/bootstrap.min.js"></script>


</body>
</html>